<template>
	<view class="_w-max _h-max">
		<view class="month-box" v-for="(item,index) in monthList" :key="index">
			<view class="month-title">{{item.year}}年{{item.month}}月</view>
			<view class="day-box">
				<block v-for="(day,did) in item.day"  :key="index">
					<view class="_flex-col-bet-mid">
						<view class="day color-gray _flex-col-center-mid" :class="`${day.stamp == startTime || day.stamp== endTime ?'active':''}`+`${ day.stamp > startTime && day.stamp < endTime ?'mid':''}` ">{{day.day}}</view>
						<view class="color-gold _font-12">{{day.price}}</view>
					</view>
				</block>
				<view class="block" v-for="(items,index) in 7" :key='index'></view>
			</view>
		</view>
	</view>
</template>

<script>
	import { getPriceCalendar } from '@/api/car.js'
	export default{
		data(){
			return{
				parameter: {
				  'navbar': '1',
				  'return': '1',
				  'title': '选择日期',
				  'class': false
				},
				startTime:null,
				endTime:null,
				monthList:[],
			}
		},
		methods:{
			// 获取三个月的数据
			getMonth(num,data) {
				this.monthList = data;
				return;
			    // 创建日期
			    let now = new Date();
			    // 创建年
			    var year = now.getFullYear();
			    // 创建月
			    var month = now.getMonth();
			    var mon = month;
			    var monthList = [];
			    let h=0;
			    for(let i = 0;i<num;i++){
					if(month+i>11){
						if(!h){
							year=year+1;
						}
						mon = (month+i)-12;
						h=1;
					}else{
						mon = month+i
					}
			      monthList.push(this.dealMonth(year,mon));
			    }
				
				this.monthList = monthList;
			},
			
			  // 根据传过来的年 月 生成日期
			dealMonth(year,month) {
			    let now = new Date(year, month,1);
			    var week = new Date(year, month,1).getDay();
			    var current_month_num = new Date(year, month+1,0).getDate();
			    let current_month = [];
			    for (let i = 1; i <= current_month_num; i++) {
					let day = now.setDate(i);
					let everyDay = this.dealTime(day);
					current_month.push(everyDay);
			    }
			    month = {
					'year':year,
					'month':month+1,
					'week':week,
					'day':current_month
			    }
			    return month;
			},
			  /**计算天数*/
			dealTime(num) {
			    var time = new Date(num);
			    var time_month = time.getMonth();
			    var time_day = time.getDate();
			    var today = new Date();
			    var hour = today.getHours();
			    if(hour<6){
			      today.setTime(today.getTime()-24*60*60*1000);
			    }
			    var today_month = today.getMonth();
			    var today_day = today.getDate();
			    var day = time.getDate();
			    // 判断日期是否是今天 如果是替换成文字
			    // if(time_month == today_month&&time_day==today_day) day = '今天';
				let weekDay = new Date(time).getDay();
				let	price = 0;
				switch(weekDay){
					case 0:
						price = 11000; //星期天价格
						break;
					case 6: 
						price = 12000; // 星期六价格
						break;
					default: //其余价格
					price = 800
				}
				//获取日期
			    var obj = {
					day:day,
					stamp:num,
					choose: false,
					price: price+'￥',
					overtime:''
			    }
			    if(time_month == today_month&&time_day<today_day){
					obj.overtime='过期'
					obj.price=''
			    }
			    return obj // 返回对象
			},
			// 点击确定发送请求  发送请求 需要三个参数  房型id 开始时间 结束时间 如果没有结束时间则跟开始时间一样
			// srue(){
			//     if(this.startTime==''){
			//       this.endTime='';
			//       uni.showToast({
			//         title: '请先选择开始日期',
			//         icon:'none'
			//       })
			//       return;
			//     }
			//     if(this.endTime==''){
			//       wx.showToast({
			//         title: '请先选择结束日期',
			//         icon:'none'
			//       })
			//       return;
			//     }
			//      var than=this;
			//     //  获取选中的时间戳
			//      var startTime=than.startTime;
			//      var endTime=than.endTime;
			//     //  将时间戳格式化
			//      var startDate =new Date(startTime);
			//      var endDate =new Date(endTime);
			//      var startYear = startDate.getFullYear(),startMonth = ("0" + (startDate.getMonth() + 1)).slice(-2),startSdate = ("0" + startDate.getDate()).slice(-2);
			//      var endYear = endDate.getFullYear(),endMonth = ("0" + (endDate.getMonth() + 1)).slice(-2),endSdate = ("0" + endDate.getDate()).slice(-2);
			//     //  计算出有多少天
			//      var day=(endTime-startTime)/86400/1000;
			//     //拼接时间 
			//      var start= startYear+'-'+startMonth+'-'+startSdate;
			//      var end =endYear+'-'+endMonth+'-'+endSdate;
			//     // 将拼接的时间存到全局变量
			//      // app.globalData.start=start;
			//      // app.globalData.end=end;
			//      // app.globalData.day=day;
			//      // uni.switchTab({
			//      //   url: '/pages/index/new_index',
			//      // })
			// },
		},
	}
</script>

<style>
.day-box{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
}
.month-box{
  text-align: center;
  /* padding: 0 30rpx; */
  margin-bottom: 100rpx;
}
.month-title{
  padding: 40rpx 0;
  font-size: 28rpx;
  font-weight: bold;
}
.day-item{
  width: 98rpx;
  height: 98rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.block{
  width: 98rpx;
  height: 0;
}
.day{
  width: 60rpx;
  height: 60rpx;
  line-height: 50rpx;
  margin-bottom: 6rpx;
  border-radius: 50%;
  font-size: 30rpx;
}
.active{
  background: #E7B953;
  color: #fff;
}
.mid{
  background: rgba(231, 185, 83, 0.5);
  color: #fff;
}

.btn{
  font-size: 30rpx;
  position: fixed;
  right: 275rpx;
  bottom: 20px;
  border: 1px solid #D6974B;
  background-color: #D6974B;
  width: 200rpx;
  line-height: 50rpx;
  color:#fff;
}
</style>